<template>
  <div class="layout layout-100">
    <Layout class="layout-100">
      <Header class="header-cont main__title--top">{{this.$route.params.name}}</Header>
      <Content class="content-cont">
        <Form  ref="formData" :model="formData" label-position="top" :show-message="false">
            <FormItem label="字典类型" prop="typeId" :required="$route.params.type !== 'details'">
              <Select class="width50" transfer v-model="formData.typeId" placeholder="请选择字典类型"  :disabled="$route.params.type !== 'add'">
                <Option v-for="item in typeList" :value="item.id" :key="item.id">{{item.name}}</Option>
              </Select>
            </FormItem>
            <FormItem label="字典名称" prop="name" :required="$route.params.type !== 'details'">
                <Input class="width50" :maxlength="60" v-model.trim="formData.name" placeholder="请输入字典名称" :disabled="$route.params.type === 'details'"></Input>
            </FormItem>
            <FormItem label="字典编号" prop="code" :required="$route.params.type !== 'details'">
                <Input class="width50" :maxlength="30" v-model.trim="formData.code" placeholder="请输入字典编号" :disabled="$route.params.type !== 'add'"></Input>
            </FormItem>
            <FormItem label="备注说明">
                <Input v-model.trim="formData.description"  :maxlength="500" placeholder="请输入备注说明"  type="textarea" :disabled="$route.params.type === 'details'"></Input>
            </FormItem>
        </Form>
      </Content>
      <Footer class="footer-cont" v-show="$route.params.type !== 'details'">
        <Button type="primary" @click="saveSubmit('formData')">保存</Button>
        <Button @click="closetab">取消</Button>
      </Footer>
    </Layout>
  </div>
</template>

<script>
  import { mapMutations } from 'vuex'
  export default {
    name: "AddEditorDetails",
    data(){
      return{
        typeList:[],
        formData: {
          typeId: this.$route.params.typeId,
          name: '',
          code:'',
          description: ''
        },
      }
    },
    methods: {
      ...mapMutations([
        'closeTag'
      ]),
      closetab () {
        this.closeTag({
          name: this.$route.name,
          params: this.$route.params,
          query:this.$route.query
        });
      },
      getDictTypeList(){
        let params = {
          "currentPage": 1,
          "pageSize": 999,
          "orderColumn": "",
          "orderSort": "desc",
          "whereMap": {
            "name": "",//"数据字典类型名称",
            "code": "",//"数据字典类型代码",
            "description": "",//"说明"
          }
        };
        this.$api.dataDictionary.getDictTypeList(params).then((res) => {
          if(res.code === 200){
            this.typeList = res.data.resultObject;
          }else {
            this.$Message.error(res.message);
          }
        })
      },
      saveSubmit (name) {
        if(!this.formData.typeId){
          this.$Message.warning('请选择字典类型');
          return;
        }if(!this.formData.name){
          this.$Message.warning('字典名称不能为空');
          return;
        }if(!this.formData.code){
          this.$Message.warning('字典编号不能为空');
          return;
        }if (!this.$regex.userCodeReg(this.formData.code)) {
          this.$Message.warning('字典编号只能是数字,字母和下划线');
          return;
        }
        let params = {
          "typeId": this.formData.typeId,//"数据字典类型id",
          //"typeName": this.formData.typeId.name,//"数据字典类型名称",
          //"parentId": "",//"父节点id",
          "code": this.formData.code,//"数据字典代码",
          "name": this.formData.name,//"数据字典名称",
          "description": this.formData.description,//"简介说明"
        }
        if(this.$route.params.type === 'editor'){
          params.id = this.$route.params.id;
          this.$api.dataDictionary.getDictEditor(params).then((res) => {
            if(res.code === 200){
              this.$Message.success(res.message);
              this.closetab();
              this.$router.push({
                path:'/system/dict-management'
              })
              localStorage.setItem('page',JSON.stringify(this.page))
            }else {
              this.$Message.error(res.message);
            }
          })
        }else {
          this.$api.dataDictionary.getDictAdd(params).then((res) => {
            if(res.code === 200){
              this.$Message.success(res.message);
              this.closetab();
              this.$router.push({
                path:'/system/dict-management',
                params
                /* query:{           //路由传参时push和query搭配使用 ，作用时传递参数
                   type:'add',
                 }*/
              })
              localStorage.setItem('page',JSON.stringify(this.page))
            }else {
              this.$Message.error(res.message);
            }
          })
        }
      },
      //详情
      getDetail(id){
        if(this.$route.params.name === '日志详情'){
          this.$api.operationLog.getOperationLogDetail(id).then((res) => {
            if(res.code === 200){
              let data = JSON.parse(res.data.params);
              this.formData = {...data}
            }else {
              this.$Message.error(res.message);
            }
          })
        }else {
          this.$api.dataDictionary.getDetail(id).then((res) => {
            if(res.code === 200){
              this.formData = {...res.data}
            }else {
              this.$Message.error(res.message);
            }
          })
        }

      },
      initParams() {
        this.formData.typeId = this.$route.params.typeId
      }
    },
    mounted () {
      this.initParams();
      this.getDictTypeList();
      if(this.$route.params.type === 'editor' || this.$route.params.type === 'details'){
        this.getDetail(this.$route.params.id)
      }
    }
  }
</script>

<style lang="scss" scoped>
  .width50{
    width: 40%;
  }


</style>
